<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>VirtualGoods Admin</title>
<meta name="description" content="">
<meta name="author" content="">

<!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
<!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>    
<script type="text/javascript" src="<c:url value="/js/bootstrap-dropdown.js" />"></script>    

<!-- Le styles -->
<link href="<c:url value="/css/bootstrap.css" />" rel="stylesheet">
<style type="text/css">
/* Override some defaults */
html,body {
	background-color: #eee;
}

body {
	padding-top: 40px;
	/* 40px to make the container go all the way to the bottom of the topbar */
}

.container>footer p {
	text-align: center; /* center align it with the container */
}

.container {
	width: 820px;
	/* downsize our container to make the content feel a bit tighter and more cohesive. NOTE: this removes two full columns from the grid, meaning you only go to 14 columns and not 16. */
}

/* The white background content wrapper */
.content {
	background-color: #fff;
	padding: 20px;
	margin: 0 -20px;
	/* negative indent the amount of the padding to maintain the grid system */
	-webkit-border-radius: 0 0 6px 6px;
	-moz-border-radius: 0 0 6px 6px;
	border-radius: 0 0 6px 6px;
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .15);
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .15);
	box-shadow: 0 1px 2px rgba(0, 0, 0, .15);
}

/* Page header tweaks */
.page-header {
	background-color: #f5f5f5;
	padding: 20px 20px 10px;
	margin: -20px -20px 20px;
}

/* Styles you shouldn't keep as they are for displaying this base example only */
.content .span10,.content .span4 {
	min-height: 500px;
}
/* Give a quick and non-cross-browser friendly divider */
.content .span4 {
	margin-left: 0;
	padding-left: 19px;
	border-left: 1px solid #eee;
}

.topbar .btn {
	border: 0;
}
</style>
</head>

<body>

	<c:if test="${empty usuarioLogado.usuario}">
	<div class="topbar">
		<div class="fill">
			<div class="container">
				<a class="brand" href="<c:url value="/" />">Project name</a>
				<ul class="nav">
					<li class="active"><a href="<c:url value="/" />">Home</a></li>
					<li><a href="<c:url value="/usuario/form" />">Novo Usuário</a></li>
					<li><a href="<c:url value="/administrator/list" />">Administrator</a></li>
					<li><a href="<c:url value="/operator/list" />">Operator</a></li>
				</ul>
				<form action="<c:url value="/usuario/login" />" class="pull-right">
					<input class="input-small" type="text" placeholder="Username" name="usuario.login" id="usuario.login">
					<input class="input-small" type="password" placeholder="Password" name="usuario.senha" id="usuario.senha">
					<button class="btn" type="submit">Sign in</button>
				</form>
			</div>
		</div>
	</div>
	</c:if>
	
	<c:if test="${not empty usuarioLogado.usuario}">
	<div class="topbar" data-dropdown="dropdown" >
      <div class="topbar-inner">
        <div class="container">
          <h3><a href="<c:url value="/" />">Project Name</a></h3>
          <ul class="nav">
           <li class="active"><a href="<c:url value="/" />">Home</a></li>
			<li><a href="<c:url value="/usuario/form" />">Novo Usuário</a></li>
			<li><a href="<c:url value="/administrator/list" />">Administrator</a></li>
			<li><a href="<c:url value="/operator/list" />">Operator</a></li>            
          </ul>
          <ul class="nav secondary-nav">
            <li class="dropdown">
              <a href="#" class="dropdown-toggle">${usuarioLogado.usuario.nome}</a>
              <ul class="dropdown-menu">
                <li><a href="<c:url value="/usuario/logout" />">Logout</a></li>
              </ul>
            </li>
          </ul>
        </div>
      </div><!-- /topbar-inner -->
    </div><!-- /topbar -->
    </c:if>
	
	<div class="container">

		<div class="content">
			<div class="page-header">
				<h1>
					Login <small>Efetue o login ou cadastre um novo usuário</small>
				</h1>
			</div>
			<div class="row">
				<div class="span10">
					<!-- ADICIONANDO ERROS -->
					<c:if test="${not empty errors}">
						<c:forEach items="${errors}" var="error">
						<span class="label important">${error.message}</span><br />
						</c:forEach>				
					</c:if>
				</div>
				<div class="span4">
					
				</div>
			</div>
		</div>

		<footer>
		<p>&copy; Company 2011</p>
		</footer>

	</div>
	<!-- /container -->

</body>
</html>